<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" xmlns="http://www.w3.org/1999/html">
<head>
    <meta name="baidu-site-verification" th:content="${@environment.getProperty('baidu.site.verification')}"/>
    <meta name="sogou_site_verification" th:content="${@environment.getProperty('sogou.site.verification')}"/>
    <meta name="baidu_union_verify" th:content="${@environment.getProperty('baidu.union.verify')}">
    <th:block th:insert="~{common/header :: head}"></th:block>
    <link rel="stylesheet" href="/css/community.css">
    <title th:text="${@environment.getProperty('site.main.title')}"></title>

    <script src="/js/jquery-3.4.1.min.js" type="application/javascript"></script>
    <script src="/js/sockjs.js" type="application/javascript"></script>
    <script src="/js/stomp.js" type="application/javascript"></script>
    <script src="/js/im.js" type="application/javascript"></script>
</head>
<body>

<div th:insert="~{common/header :: nav}"></div>

<div th:insert="~{common/header :: sub_nav}"></div>


<div class="layui-container">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md8">
            <div class="fly-panel">
                <div class="fly-panel-title fly-filter">
                    <a>欢迎您的到来~</a>
                    <!--a href="#signin" class="html5plus-hide layui-hide-sm layui-show-xs-block fly-right" id="LAY_goSignin" style="color: #FF5722;">去签到</a-->
                    <a th:if="${loginUser==null}" href="/sso/login" class="layui-hide-sm fly-right html5plus-display"
                       id="LAY_gologin" style="color: #FF5722;display: none">注册/登录</a>
                    <a th:if="${loginUser!=null}"
                       class="fly-nav-avatar technology-avatar layui-hide-sm fly-right html5plus-display html5plus-user-icon"
                       id="LAY_goUserCenter" style="color: #FF5722;display: none">
                        <!--img th:src="${session.user.avatarUrl}"-->
                        <i th:if="${loginUser.vipRank==1}" class="layui-icon fly-list-kiss layui-hide-xs"
                           title="红砖会员等级：LV1">&#xe735</i>
                        <cite onclick="javascript:window.open('/user/set/info')"
                              th:class="${loginUser.vipRank==1? 'fly-list-kiss':''}" th:text="${loginUser.name}"></cite>
                        <!--span onclick="javascript:window.open('/user/message')" th:if="${session.unreadCount!=0}" class="layui-badge" th:text="${session.unreadCount}"></span-->
                    </a>

                </div>
                <ul class="fly-list">
                    <li th:each="question : ${topQuestions}">
                        <a th:href="${'/user/'+question.user.id}" class="fly-avatar technology-avatar">
                            <img th:src="${question.user.avatarUrl}"
                                 th:alt="${question.user.name}">
                        </a>
                        <h2>
                            <a class="layui-badge" th:if="${question.column2==1}">提问</a>
                            <a class="layui-badge" th:if="${question.column2==2}">分享</a>
                            <a class="layui-badge" th:if="${question.column2==3}">建议</a>
                            <a class="layui-badge" th:if="${question.column2==4}">讨论</a>
                            <a class="layui-badge layui-bg-green" th:if="${question.column2==5}">公告</a>
                            <a class="layui-badge" th:if="${question.column2==6}">动态</a>
                            <a class="layui-badge" th:if="${question.column2==9}">其它</a>
                            <a th:if="${question.permission==10}" class="fly-list-like layui-hide-xs" title="会员尊享"><i
                                    class="layui-icon">&#xe735</i></a>
                            <a th:href="@{'/p/'+ ${question.id}}" th:text="${question.title}"
                               th:title="${question.title}" target="_blank"
                               th:style="${question.permission==10? 'color:red':''}"></a>
                            <a th:if="${question.viewCount>100}" class="fly-list-like layui-hide-xs" title="烫烫烫"><i
                                    class="layui-icon" style="font-size: 20px">&#xe756;</i></a>
                        </h2>
                        <div class="fly-list-info">
                            <a link>
                                <i th:if="${question.userAccount.vipRank==1}" class="layui-icon fly-list-kiss"
                                   title="红砖会员等级：LV1">&#xe735</i>
                                <cite th:class="${question.userAccount.vipRank==1? 'fly-list-kiss':''}"
                                      th:text="${question.user.name}"></cite>
                                <i class="layui-badge fly-badge-vip layui-bg-gray layui-hide-xs"
                                   th:text="${@environment.getProperty('user.group.r'+question.userAccount.groupId)}"></i>
                            </a>
                            <span th:text="${question.gmtLatestCommentStr}"></span>

                            <!--span class="fly-list-kiss layui-hide-xs" title="浏览"><i class="iconfont icon-kiss"></i><span th:text="${question.viewCount}"></span></span-->
                            <span class="fly-list-like layui-hide-xs" title="收藏"><i class="layui-icon">&#xe600;</i><span
                                    th:text="${question.LikeCount}"></span></span>
                            <!--span class="layui-badge fly-badge-accept layui-hide-xs">已结</span-->
                            <span class="fly-list-nums">
                <i class="iconfont layui-hide-xs" title="浏览">&#xe60b;</i> <span class="layui-hide-xs"
                                                                                th:text="${question.viewCount}"></span>
                <i class="iconfont icon-pinglun1" title="回复"></i> <span th:text="${question.commentCount}"></span>
              </span>
                        </div>
                        <div class="fly-list-badge">

                            <span th:if="${question.status==2||question.status==3}" class="layui-badge layui-bg-orange">置顶</span>
                        </div>
                    </li>

                </ul>
            </div>

            <div class="fly-panel" style="margin-bottom: 0;">

                <div class="fly-panel-title fly-filter">
                    <a href="/forum" th:class="${sort == 'new' || sort == null ? 'layui-this':''}">综合</a>
                    <span class="fly-mid"></span>
                    <a th:class="${sort == 'hot7' ? 'layui-this':''}"
                       th:href="@{/forum/(sort='hot7',search=${search},tag=${tag},column=${column})}">周榜</a>
                    <span class="fly-mid"></span>
                    <a th:class="${sort == 'hot30' ? 'layui-this':''}"
                       th:href="@{/forum/(sort='hot30',search=${search},tag=${tag},column=${column})}">月榜</a>
                    <span class="fly-mid"></span>
                    <a th:class="${sort == 'good' ? 'layui-this':''}"
                       th:href="@{/forum/(sort='good',search=${search},tag=${tag},column=${column})}">精华</a>
                    <span class="fly-filter-right">
            <!--a th:href="@{/t/(sort=${sort},search=${search},tag=${tag},column=${column})}" style="color: red" class="layui-hide-xs"><i class="layui-icon">&#xe636;</i>瀑布流</a-->
            <a class="html5plus-hide" href="javascript:downloadApp()" style="color: red"><i
                    class="layui-icon">&#xe63b;</i>APP</a>
            <span class="fly-mid layui-hide-xs"></span>
            <a th:href="@{/forum/(sort='new',search=${search},tag=${tag},column=${column})}"
               th:class="${sort == 'new' || sort == null ? 'layui-this layui-hide-xs':'layui-hide-xs'}">按最新</a>
            <span class="fly-mid layui-hide-xs"></span>
            <a th:class="${sort == 'no' ? 'layui-this  layui-hide-xs':' layui-hide-xs'}"
               th:href="@{/forum/(sort='no',search=${search},tag=${tag},column=${column})}">抢沙发</a>
          </span>
                </div>

                <ul class="fly-list">
                    <li th:each="question : ${pagination.data}">
                        <div th:if="${question.status==0||question.status==1}">
                            <a th:href="${'/user/'+question.user.id}" class="fly-avatar technology-avatar">
                                <img th:src="${question.user.avatarUrl}"
                                     th:alt="${question.user.name}">
                            </a>
                            <h2>
                                <a class="layui-badge" th:if="${question.column2==1}">提问</a>
                                <a class="layui-badge" th:if="${question.column2==2}">分享</a>
                                <a class="layui-badge" th:if="${question.column2==3}">建议</a>
                                <a class="layui-badge" th:if="${question.column2==4}">讨论</a>
                                <a class="layui-badge layui-bg-green" th:if="${question.column2==5}">公告</a>
                                <a class="layui-badge" th:if="${question.column2==6}">动态</a>
                                <a class="layui-badge" th:if="${question.column2==9}">其它</a>
                                <a th:if="${question.permission==10}" class="fly-list-like layui-hide-xs"
                                   title="会员尊享"><i class="layui-icon">&#xe735</i></a>
                                <a th:href="@{'/p/'+ ${question.id}}" th:text="${question.title}"
                                   th:title="${question.title}"
                                   th:style="${question.permission==10? 'color:red':''}"></a>
                                <a th:if="${question.viewCount>100}" class="fly-list-like layui-hide-xs" title="烫烫烫"><i
                                        class="layui-icon" style="font-size: 20px">&#xe756;</i></a>
                            </h2>
                            <div class="fly-list-info">
                                <a link>
                                    <i th:if="${question.userAccount.vipRank==1}" class="layui-icon fly-list-kiss"
                                       title="红砖会员等级：LV1">&#xe735</i>
                                    <cite th:class="${question.userAccount.vipRank==1? 'fly-list-kiss':''}"
                                          th:text="${question.user.name}"></cite>
                                    <i class="layui-badge fly-badge-vip layui-bg-gray layui-hide-xs"
                                       th:text="${@environment.getProperty('user.group.r'+question.userAccount.groupId)}"></i>
                                </a>
                                <span th:text="${question.gmtLatestCommentStr}"></span>

                                <!--span class="fly-list-kiss layui-hide-xs" title="浏览"><i class="iconfont icon-kiss"></i><span th:text="${question.viewCount}"></span></span-->
                                <span class="fly-list-like layui-hide-xs" title="收藏"><i
                                        class="layui-icon">&#xe600;</i><span
                                        th:text="${question.LikeCount}"></span></span>
                                <!--span class="layui-badge fly-badge-accept layui-hide-xs">已结</span-->
                                <span class="fly-list-nums">
                <i class="iconfont layui-hide-xs" title="浏览">&#xe60b;</i> <span class="layui-hide-xs"
                                                                                th:text="${question.viewCount}"></span>
                <i class="iconfont icon-pinglun1" title="回复"></i> <span th:text="${question.commentCount}"></span>
              </span>
                            </div>
                            <div class="fly-list-badge">
                                <span th:if="${question.status==1||question.status==3}"
                                      class="layui-badge layui-bg-red">精帖</span>
                            </div>
                        </div>
                    </li>
                </ul>

                <div style="text-align: center">
                    <div class="laypage-main"><!-- 分页展示 -->
                        <a th:if="${pagination.showFirstPage}"
                           th:href="@{/forum/(page=1,search=${search},tag=${tag},sort=${sort},column=${column})}"
                           aria-label="Previous" class="laypage-prev">
                            &laquo;
                        </a>
                        <a th:if="${pagination.showPrevious}"
                           th:href="@{/forum/(page=${pagination.page - 1},search=${search},tag=${tag},sort=${sort},column=${column})}"
                           class="laypage-prev">
                            &lt;
                        </a>
                        <th:block th:each="page : ${pagination.pages}">
                            <a th:if="${pagination.page != page}"
                               th:href="@{/forum/(page=${page},search=${search},tag=${tag},sort=${sort},column=${column})}"
                               th:text="${page}"></a>
                            <span th:if="${pagination.page == page}"
                                  th:href="@{/forum/(page=${page},search=${search},tag=${tag},sort=${sort},column=${column})}"
                                  th:text="${page}"
                                  class="laypage-curr"></span>
                        </th:block>
                        <a th:if="${pagination.showNext}"
                           th:href="@{/forum/(page=${pagination.page +1 },search=${search},tag=${tag},sort=${sort},column=${column})}"
                           class="laypage-next">
                            &gt;
                        </a>
                        <a th:if="${pagination.showEndPage}"
                           th:href="@{/forum/(page=${pagination.totalPage},search=${search},tag=${tag},sort=${sort},column=${column})}"
                           aria-label="Next" class="laypage-next">
                            &raquo;
                        </a>

                    </div>
                </div>

            </div>
        </div>


        <th:block th:insert="~{common/sider :: index}"></th:block>
    </div>
</div>


<!--script type="text/javascript">var cnzz_protocol = (("https:" == document.location.protocol) ? " https://" : " http://");document.write(unescape("%3Cspan id='cnzz_stat_icon_30088308'%3E%3C/span%3E%3Cscript src='" + cnzz_protocol + "w.cnzz.com/c.php%3Fid%3D30088308' type='text/javascript'%3E%3C/script%3E"));</script-->
<th:block th:insert="~{common/footer :: foot}"></th:block>
<script>
    layui.cache.page = 'index';
    layui.cache.user = {
        //username: '匿名用户'
        //,uid: -1
        //  ,avatar: '/images/avatar/00.jpg'
        name: '[[${loginUser!=null?loginUser.name:"匿名用户"}]]'
        , uid: [[${loginUser!=null?loginUser.id:-1}]]
        , avatar: '[[${loginUser!=null?loginUser.avatarUrl:"/images/avatar/default.png"}]]'
        , experience: 83
        , sex: '男'
    };
    layui.config({
        version: "3.0.0"
        , base: '/mods/'  //这里实际使用时，建议改成绝对路径
    }).extend({
        fly: 'index'
    }).use('fly');
</script>

<script>
    layui.use(['layer', 'form', 'jquery', 'laydate'],
        function () {
            var layer = layui.layer, $ = layui.jquery, laydate = layui.laydate, form = layui.form;
            //定义json
            var data = {};
            var new_date = new Date();
            var data = {};
            var markDate;
            var nowDate = new Date();
            var userId = '1';
            // 默认查找30天签到记录
            var data = {
                userId: userId,
                day: 30
            };
            //获取签到记录 加载到日期控件上
            var markDate;
            $.ajaxSettings.async = false;
            $.get('/currentYearSign', data,
                function (result) {
                    debugger;
                    if (result.code == 0) {
                        if (result.data) {
                            markDate = result.data;
                        } else {
                            markDate = {};
                        }
                    } else {
                        top.layer.msg("签到数据初始化错误!");
                    }
                });
            $.ajaxSettings.async = true;
            loding_date(new_date, data, markDate);

            //日历插件调用方法
            function loding_date(date_value, data, markDate) {
                laydate.render({
                    elem: '#signInPanel',
                    type: 'date',
                    theme: 'grid',
                    max: '2099-06-16 23:59:59',
                    min: -365,
                    position: 'static',
                    range: false,
                    mark: markDate,
                    value: date_value,
                    calendar: false,
                    btns: false,
                    done: function (value, date, endDate) {
                        console.log(value);
                        console.log(date);
                        console.log(endDate);
                        //layer.msg(value)
                        //调用弹出层方法
                        date_chose(value, data);
                    }
                });
            }

            //定义弹出层方法
            function date_chose(obj_date, data) {
                if (markDate) {
                    if (markDate.hasOwnProperty(obj_date)) {
                        top.layer.msg("当前已签到无需重复签到!");
                        return;
                    }
                }
                var currentTime = new Date().Format("yyyy-MM-dd");
                if (obj_date != currentTime) {
                    top.layer.msg("非当前日期不可以签到!");
                    return;
                }

                var index = layer.confirm('您确定要签到？', {
                    title: '提示',
                    btn: ['签到', '取消']
                    //按钮
                }, function () {
                    var params = {
                        'signInDate': obj_date
                    };

                    $.post('/sign', params, function (result) {
                        if (result.code == 0) {
                            top.layer.msg("签到成功!");
                            markDate[obj_date + ""] = "√";
                            chose_moban(obj_date, data);
                            layer.close(index);
                        } else {
                            top.layer.msg("签到失败:" + result.msg);
                            layer.close(index);
                        }
                    });
                }, function () {
                    chexiao(obj_date, data);
                });
            }

            //定义添加/编辑标注方法
            function chose_moban(obj_date, markJson) {
                //获取弹出层val
                var chose_moban_val = $('#text_book').val();
                $('#signInPanel').html('');//重要！由于插件是嵌套指定容器，再次调用前需要清空原日历控件
                markJson[obj_date] = "√";
                console.log(JSON.stringify(markJson));
                //再次调用日历控件，
                loding_date(obj_date, markJson, markDate);//重要！，再标注一个日期后会刷新当前日期变为初始值，所以必须调用当前选定日期。
            }

            //撤销选择
            function chexiao(obj_date, markJson) {
                //删除指定日期标注
                delete markJson[obj_date];
                console.log(JSON.stringify(markJson));
                $('#signInPanel').html('');
                loding_date(obj_date, markJson, markDate);
            }
        })
    Date.prototype.Format = function (fmt) {
        var o = {
            "M+": this.getMonth() + 1, //月份
            "d+": this.getDate(), //日
            "h+": this.getHours(), //小时
            "m+": this.getMinutes(), //分
            "s+": this.getSeconds(), //秒
            "q+": Math.floor((this.getMonth() + 3) / 3), //季度
            "S": this.getMilliseconds() //毫秒
        };
        if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
        for (var k in o)
            if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
        return fmt;
    }
</script>

<script>

    layui.use('layim', function(layim){


        var $ = layui.jquery;

        layim.config({
            brief: true //是否简约模式（如果true则不显示主面板）
            ,voice: false
            ,chatLog: layui.cache.dir + 'css/modules/layim/html/chatlog.html'
        });

        var tiows = new tio.ws($, layim);


        // 获取个人、群聊信息，并打开聊天窗口
        tiows.openChatWindow();

        // 历史聊天信息回显
        tiows.initHistoryMess();

        // 建立连接ws
        tiows.connect();

        // 发送消息
        layim.on('sendMessage', function (res) {
            tiows.sendChatMessage(res);
        });

    });
</script>
<script>
    $(function () {
        var elemUser = $('.fly-nav-user');
        if(true){
            var socket = new SockJS("/websocket")
            stompClient = Stomp.over(socket);
            stompClient.connect({}, function (frame) {
                stompClient.subscribe("/user/" + ${loginUser.id} + "/messCount", function (res) {

                    console.log(res);

                    // 弹窗
                    showTips(res.body);
                })
            });

        }
    });
</script>
</body>
</html>